<template>
	<view class="list-box">
	    <view class="image-left-box">
	        <image class="image-self" :lazyLoad="true" mode="widthFix" :src="item.url" v-if="index%2==0" v-for="(item,index) in list" wx:key="index"></image>
	    </view>
	    <view class="image-right-box">
	        <image class="image-self" :lazyLoad="true" mode="widthFix" :src="item.url" v-if="index%2==1" v-for="(item,index) in list" wx:key="index"></image>
	    </view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			};
		},
		props: {
			list: {
				type: Array
			}
		},
	}
</script>

<style>
.list-box {
    width: 750rpx;
    display: flex;
}

.image-left-box,.image-right-box {
    width: 375rpx;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
}

.image-left-box {
    padding-left: 30rpx;
}

.image-right-box {
    padding-right: 30rpx;
    -webkit-box-align: end;
    align-items: flex-end;
}

.image-self {
    width: 330rpx;
    background-color: transparent;
    border-radius: 10rpx;
    margin-bottom: 28rpx;
}
</style>
